<template>
	<div>
		<header>
			<span @click="backClick"><返回</span>
			<span>当前位置：业务总览</span>
			<div class="div">
				当前选择：
			  	<el-select v-model="value" placeholder="请选择" @change="change">
				    <el-option
				      v-for="item in departmentArr"
				      :key="item.id"
				      :label="item.name"
				      :value="item.name"
				      :disabled='item.dtDisabled'>
				    </el-option>
			  	</el-select>
			</div>
		</header>
		<div class="detail_container" :style="{height: heightClient}">
			<div class="side_choose" >
				<div class="choose_bar">
					<div class="bar" @click="barClick('outTotalPeo')" 
					:class="[{active: outShow}]">
						<div class="bar-title">出院情况</div>
						<div class="bar-list" :class="{spe: fontover}">
							<span>{{outTotalPeo}}人次</span>
						</div>
						
					</div>
					<div class="bar" @click="barClick('medicalPeo')"
					:class="[{active: averageShow}]">	
						<div class="bar-title">门急诊情况</div>
						<div class="bar-list" :class="{spe: fontover}">
							<span>{{medicalPeo}}人次</span>
						</div>
					</div>
					<div class="bar" @click="barClick('surgeryNum')"  
					:class="[{active: useShow}]">
						<div class="bar-title">手术情况</div>
						<div class="bar-list" :class="{spe: fontover}">
							<span>{{surgeryNum}}台</span>
						</div>
					</div>
					<div class="bar" @click="barClick('medSum')"  
					:class="[{active: otherShow}]">
						<div class="bar-title">药品使用情况</div>
						<div class="bar-list" :class="{spe: fontover}">
							<span>{{medIncomeTotal}}万元</span>
						</div>
					</div>
				</div>
				<div>
					<span class="list-title" v-show="outShow">经治组业务量&nbsp;&nbsp;&nbsp;(出入院动态-出院人数)</span>
					<span class="list-title" v-show="averageShow">医生业务量&nbsp;&nbsp;&nbsp;(门急诊情况-诊疗人次)</span>
					<span class="list-title" v-show="useShow">经治组业务量&nbsp;&nbsp;&nbsp;(手术总量)</span>
					<span class="list-title title-span" v-show="otherShow">
						<span :class="{activeSpan: treatmentGroup}" @click="titleClick('medSum')">经治组</span>
						<span :class="{activeSpan: doctor}" @click="titleClick('medSumHuman')">医生个人</span>
					</span>
				</div>
				<div style="overflow-y: auto; height: calc(100% - 230px); width: calc(100% - 20px); margin: 0 auto;" id="options">
					
					<div ref="list" style="width: 100%" :style="{height: listHeight}" v-show="!imgShow"></div>
					<div style="width: 100%; height: calc(100% - 230px)" v-show="imgShow">
						<img src="./../../assets/lackshort.svg" style="display: block;margin: 10% auto 0" > 
					</div>
					
				</div>
			</div>
			<div class="container_right">
				<div class="right_top">
					<div class="right_title" v-if="otherShow">药品使用趋势</div>
					<div class="right_title" v-if="outShow">出院人数趋势</div>
					<div class="right_title" v-if="useShow">手术总量趋势</div>
					<div class="right_title" v-if="averageShow">门诊诊疗人次趋势</div>
					<div ref="incomeTrend" style="height: calc(100% - 50px); width: 100%;"></div>
				</div>
				<div class="right_bottom" v-if="outShow">
					<div class="big_left">
						<div class="left">
							<div class="right_title">出入院动态</div>
							<ul>
								<li>
									<span>{{endMonPeo}}</span><br>
									<span>上期末人数</span>
								</li>
								<span>|</span>
								<li>
									<span>{{endLeftPeo}}</span><br>
									<span>期末留院人数</span>
								</li>
								<li>
									<span>{{inPeo}}</span><br>
									<span>入院人数</span>
								</li>
								<span>|</span>
								<li>
									<span>{{outSickPeo}}</span><br>
									<span>出院病人数</span>
								</li>
								<li>
									<span>{{intoPeo}}</span><br>
									<span>他科转入</span>
								</li>
								<span>|</span>
								<li>
									<span>{{tranOutPeo}}</span><br>
									<span>转入他科</span>
								</li>
							</ul>	
						</div>
						<div ref="dongtai" style="width: 50%; height: calc(100% - 50px); margin-top: 43px;border-top: 1px solid #ddd"></div>
						<!-- <div class="right">
							<div class="right_title"></div> -->
							
						<!-- </div> -->
						
						
					</div>
					<div class="small_right">
						<div class="right_title">
							耗材情况
						</div>
						<span class="span-sr">耗材总额： {{conTotal}}</span>
						<div ref="zhuyuanhaocai"  style="width: 100%;height: calc(100% - 100px);"></div>
					</div>
				</div>
				<div class="right_bottom" v-if="averageShow">
					<div class="normal">
						<div class="right_title">
							门急诊情况
						</div>
						<ul>
							<li>
								<span>{{outpatientPeo}}</span><br>
								<span>门诊人次</span>
							</li>
							<span>|</span>
							<li>
								<span>{{emergencyPeo}}</span><br>
								<span>急诊人次</span>
							</li>
							
						</ul>
						<img src="../../assets/tiaomore.png">
					</div>
					<div class="small_right">
						<div class="right_title">
							耗材情况
						</div>
						<span class="span-sr">耗材总额： {{conTotal}}</span>
						<div ref="menzhenhaocai" style="width: 100%; height: calc(100% - 100px);"></div>
					</div>
				</div>
				<div class="right_bottom" v-if="useShow">
					<div class="normal">
						<div class="right_title">
							手术构成
						</div>
						<div ref="shoushu" style="width: 100%; height: calc(100% - 50px);"></div>	
					</div>
					<div class="small_right">
						<div class="right_title">
							耗材情况
						</div>
						<span class="span-sr">耗材总额： {{conTotal}}</span>
						<div ref="shoushuhaocai" style="width: 100%; height: calc(100% - 100px);"></div>
					</div>
				</div>
				<div class="right_bottom" v-if="otherShow">
					<div class="small_bar">
						<div class="right_title">
							住院用药
						</div>
						<span class="span-sr">住院用药总额： {{medHosNum}}</span>
						<div ref="zhuyuanyaopin" style="width: 100%;height: calc(100% - 100px);"></div>
					</div>
					<div class="small_bar" style="width: 32%;">
						<div class="right_title">
							门诊用药
						</div>
						<span class="span-sr">门诊用药总额： {{medMemNum}}</span>
						<div ref="menzhenyaopin" style="width: 100%;height: calc(100% - 100px);"></div>
					</div>
					<div class="small_bar">
						<div class="right_title">
							耗材情况
						</div>
						<span class="span-sr">耗材总额： {{conTotal}}</span>
						<div ref="yaopinhaocai" style="width: 100%;height: calc(100% - 100px);"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
import axios from 'axios'
import echarts from 'echarts'
export default {
	data () {
		return {
			listHeight: '0px',
			type: this.$route.params.type,
			heightClient: '0px',
			menzhenshoushushow: true,
			a: true,
			fontover: false,
			value: '',
			outShow: true,
			imgShow: false,
			averageShow: false,
			useShow: false,
			otherShow: false,
			departmentArr: [],
			perMonthDep: {},
			heightClient: '0px',
			tabShow: true,
			isAct: true,
			isActive1: false,
			isActive2: false,
			isActive3: false,
			treatmentGroup: true,
			doctor: false,
			type: '诊疗人次',
			clickArr: [],//用于点击事件
			departmentType: '',//部门类型
			title: '出入院动态',
			depId: '',
			departmentArr: [],
			endMonPeo: '',//上期末人数
			endLeftPeo: "0", //期末留院人数
			hosEmePeo: "0", //急诊住院人数
			hosNorPeo: "0", //普通住院人数
          	inPeo: "0", //入院人数
			intoPeo: "0", //他科转入人数
			outPeo: "0", //出院人数
			outTotalPeo: "0", //出院总人数
			tranOutPeo: "0", //转入他科人数
			outSickPeo: "0", //出院病人数
			outInBaby: "0", //新生儿
			surgeryNum: "0", //手术总数
			medIncomeTotal: "0", //用药总额
			conTotal: "0", //耗材总额
			medHosNum: "", //住院用药总额
			medMemNum: "", //门诊用药总额
			medicalPeo: "0", //诊疗人次
			outpatientPeo: "0", //门诊人次
			emergencyPeo: "0", //急诊人次
			departmentCode: [],//经治组部门code
			options: {
			    tooltip: {
			        trigger: 'axis',
			        enterable:true,
			  //       position: function(point, params, dom, rect, size){
					// 	//其中params为当前鼠标的位置
					// 	return ['10%',params[0]];

					// }
			    },
			    grid: {
			        left: '3%',
			        right: '86px',
			        bottom: '3%',
			        top: '0',
			        containLabel: true
			    },
			    xAxis: [{
			        type: 'value',
			        data: [],
			        show: false
			    },{
			        type: 'value',
			        data: [],
			        show: false
			    }],
			    
			    yAxis:[ {

    				type: "category",
			        data: [],
			        nameGap: '100',
			        boundaryGap: true,
			        axisLine: {
			        	show: false
			        },
			        axisTick: {
			        	show: false,
			        	length: 100
			        },
			        axisLabel: {
			        	interval: 0
			        }
			    },{

    				type: "category",
			        data: [],
			        nameGap: '100',
			        boundaryGap: true,
			        show: false,
			    }],
			    series: [
			        {	
			        	xAxisIndex: 0,
						yAxisIndex: 0,
			            type: 'bar',
			            barWidth: 20,
			            data: [],
			            // legendHoverLink: false,
			            label: {
			            	show: true,
			            	position: 'right',
			            	color: '#333',
			            	formatter: function(params) {
			            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
			            	}
			            },
			            emphasis: {
			            	itemStyle: {
			            		color: '#71C957'
			            	}
			            },
			            itemStyle: {
			            	normal: {
			            		color: '#A7DB98',
			            		
			            	},

			            }
			        },
			        {	
			        	xAxisIndex: 1,
						yAxisIndex: 1,
			            type: 'bar',
			            barWidth: 20,
			            data: [500,500,500],
			            itemStyle: {
							normal: {
							barBorderColor: 'transparent',
							color: 'transparent'
							}
            			}		
			            
			        }

			    ]
			  },
				optionsIncomeTrend: {

			    tooltip: {
			        trigger: 'axis'
			    },
			    legend: {
			        data:[
			        	{
			        		icon: 'circle',
			        		name: '本月'
			        	},
			        	{
			        		icon: 'circle',
			        		name: '同期'
			        	}
			        ],
			        top: '3%'
			    },
			    grid: {
			    	top: '15%',
			    	right: '3%',
			    	bottom: '15%',
			    	left: '8%'
			    },
			    xAxis: [
			        {
			            type: 'category',
			            data: [],
			            // axisPointer: {
			            //     show: false
			            // },
			            axisTick: {
			            	show: false
			            },
			            axisLine: {
			            	show: false
			            }
			        }
			    ],
			    yAxis: 
			        {
			            type: 'value',
			            axisLabel: {
			                // formatter: '{value}'
			                formatter: function(value){
			                	if(Number(value) > 1000) {
			                		return Number(value)/1000 + 'K'
			                	} else {
			                		return value
			                	}
			                	
			                }
			            },
			            axisTick: {
			            	show: false
			            },
			            axisLine: {
			            	show: false
			            },
			            splitLine: {
			            	lineStyle: {
			            		color: '#E6E6E6',
			            		type: 'dashed'
			            	}
			            }
			        },
			    series: [
			        {
			            name:'本月',
			            type:'bar',
			            barWidth: 21,
			            data:[2.0, 4.9, 7.0, 23.2],
			            itemStyle: {
			            	normal: {
			            		color: '#569ED0'
			            	}
			            },
			            emphasis: {
			            	itemStyle: {
			            		color: '#60ADE2'
			            	}
			            }
			        },
			        {
			            name:'同期',
			            type:'line',
			            symbolSize: 10,
			            data:[2.0, 2.2, 3.3, 4.5],
			            itemStyle: {
			            	normal: {
			            		color: '#FBC05A'
			            	}
			            }
			        }
			    	] 
				},
				optionsShoshu: {
				
					tooltip : {
				        trigger: 'item',
				        formatter: "{b} : {c}"
				    },
				    grid: {
				    	bottom: '0'
				    },
				    legend: {
				        orient: 'vertical',
				        // top: 'middle',
				        bottom: 10,
				        //left: 'right',
				        itemWidth: 10,
				        align: 'right',
				        right: 10,
				        data: [
				        	{
				        		icon: 'circle',
				        		name: '特级'
				        	}, 
				        	{
				        		icon: 'circle',
				        		name: '甲级'
				        	},
				        	{
				        		icon: 'circle',
				        		name: '乙级'
				        	},
				        	{
				        		icon: 'circle',
				        		name: '丙级'
				        	}, 
				        	{
				        		icon: 'circle',
				        		name: '丁级'
				        	},
				        	{
				        		icon: 'circle',
				        		name: '戊级'
				        	},
				        	{
				        		icon: 'circle',
				        		name: '己级'
				        	},
				        	{
				        		icon: 'circle',
				        		name: '庚级'
				        	}
				        ]
				    },
				    series : [
				        {
				            type: 'pie',
				            radius : '55%',
				            center: ['50%', '50%'],
				            selectedMode: 'single',
				            label: {
				            	show: false
				            },
				            data:[
				                {
				                    value:'220',
				                    name: '特级',
				                    itemStyle: {
				                    	color: '#E8D352'
				                    }
				                },
				                {
				                	value:'620', 
				                	name: '甲级',
				                    itemStyle: {
				                    	color: '#91AFEC'
				                    }
				                },
				                {
				                	value:'290', 
				                	name: '乙级',
				                    itemStyle: {
				                    	color: '#63C2C6'
				                    }
				                },
				                {
				                    value:'220',
				                    name: '丙级',
				                    itemStyle: {
				                    	color: '#B0A8DE'
				                    }
				                },
				                {
				                	value:'620', 
				                	name: '丁级',
				                    itemStyle: {
				                    	color: '#72B8EF'
				                    }
				                },
				                {
				                	value:'290', 
				                	name: '戊级',
				                    itemStyle: {
				                    	color: '#F3BA8B'
				                    }
				                },
				                {
				                	value:'290', 
				                	name: '己级',
				                    itemStyle: {
				                    	color: '#CFDF87'
				                    }
				                },
				                {
				                	value:'290', 
				                	name: '庚级',
				                    itemStyle: {
				                    	color: '#92CF9F'
				                    }
				                }
				            ],
				            itemStyle: {
				                emphasis: {
				                    shadowBlur: 10,
				                    shadowOffsetX: 0,
				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
				                }
				            }
				        }
				    ]
				},
				optionsZhuyuan: {
					tooltip : {
				        trigger: 'item',
				        formatter: "{b} : {c}<br> 占比：{d}% "
				    },
				    legend: {
				        orient: 'vertical',
				        bottom: 20,
				        itemWidth: 12,
				        itemHeight: 12,
				        // left: 'right',
				        right: 10,
				        bottom: 10,
				        align: 'right',
				        data: [
					        {
					        	icon: 'circle',
					        	name: '西药',
					        },
				        	{
				        		icon: 'circle',
				        		name: '中成药',
				        	},
				        	{
				        		icon: 'circle',
				        		name: '中药饮片',
				        	}
				        ]
				    }, 
				    series : [
				        {
				            type: 'pie',
				            radius : '55%',
				            center: ['50%', '50%'],
				            selectedMode: 'single',
				            label: {
				            	show: false,
				            	formatter: '{b}\n总额：{c} \n占比： {d}%'
				            },
				            labelLine:{  
				                normal:{  
				                    length: 2  
				                }  
				            }, 
				            data:[
				                {
				                    value:220,
				                    name: '西药',
				                    itemStyle: {
				                    	color: '#91AFEC'
				                    }
				                },
				                {
				                	value:620, 
				                	name: '中成药',
				                    itemStyle: {
				                    	color: '#CFDF87'
				                    }
				                },
				                {
				                	value:290, 
				                	name: '中药饮片',
				                    itemStyle: {
				                    	color: '#63C2C6'
				                    }
				                }
				            ],
				            itemStyle: {
				                emphasis: {
				                    shadowBlur: 10,
				                    shadowOffsetX: 0,
				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
				                }
				            }
				        }
				    ]
				},
				optionsMenzhen: {
				    tooltip : {
				        trigger: 'item',
				        formatter: "{b} : {c}<br> 占比：{d}% "
				    },
				    legend: {
				        orient: 'vertical',
				        bottom: 20,
				        itemWidth: 12,
				        itemHeight: 12,
				        // left: 'right',
				        right: 10,
				        bottom: 10,
				        align: 'right',
				        data: [
					        {
					        	icon: 'circle',
					        	name: '西药',
					        },
				        	{
				        		icon: 'circle',
				        		name: '中成药',
				        	},
				        	{
				        		icon: 'circle',
				        		name: '中药饮片',
				        	}
				        ]
				    }, 
				    series : [
				        {
				            type: 'pie',
				            radius : '55%',
				            center: ['50%', '50%'],
				            selectedMode: 'single',
				            label: {
				            	show: false,
				            	formatter: '{b}\n总额：{c} \n占比： {d}%'
				            },
				            data:[
				                {
				                    value:220,
				                    name: '西药',
				                    itemStyle: {
				                    	color: '#91AFEC'
				                    }
				                },
				                {
				                	value:620, 
				                	name: '中成药',
				                    itemStyle: {
				                    	color: '#CFDF87'
				                    }
				                },
				                {
				                	value:290, 
				                	name: '中药饮片',
				                    itemStyle: {
				                    	color: '#63C2C6'
				                    }
				                }
				            ],
				            itemStyle: {
				                emphasis: {
				                    shadowBlur: 10,
				                    shadowOffsetX: 0,
				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
				                }
				            }
				        }
				    ]
				},
				optionsHaocai: {
				   tooltip : {
				        trigger: 'item',
				        formatter: "{b} : {c}<br> 占比：{d}% "
				    },
				    legend: {
				        orient: 'vertical',
				        bottom: 20,
				        itemWidth: 12,
				        itemHeight: 12,
				        // left: 'right',
				        right: 10,
				        bottom: 10,
				        align: 'right',
				        data: [
					        {
					        	icon: 'circle',
					        	name: '非护理耗材',
					        },
				        	{
				        		icon: 'circle',
				        		name: '护理耗材',
				        	}
				        ]
				    }, 
				    series : [
				        {
				            type: 'pie',
				            radius : '55%',
				            center: ['50%', '50%'],
				            selectedMode: 'single',
				            label: {
				            	show: false,
				            	formatter: '{b}\n总额：{c} \n占比： {d}%'
				            },
				            data:[
				                {
				                    value:20,
				                    name: '非护理耗材',
				                    itemStyle: {
				                    	color: '#91AFEC'
				                    }
				                },
				                {
				                	value:620, 
				                	name: '护理耗材',
				                    itemStyle: {
				                    	color: '#CFDF87'
				                    }
				                }
				            ],
				            itemStyle: {
				                emphasis: {
				                    shadowBlur: 10,
				                    shadowOffsetX: 0,
				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
				                }
				            }
				        }
				    ]
				},
				optionsDongtai: {
				    tooltip : {
				        trigger: 'item',
				        formatter: "{b} : {c}<br> 占比：{d}% "
				    },
				    legend: {
				        orient: 'vertical',
				        bottom: 20,
				        itemWidth: 12,
				        itemHeight: 12,
				        // left: 'right',
				        right: 10,
				        bottom: 10,
				        align: 'right',
				        data: [
					        {
					        	icon: 'circle',
					        	name: '治愈',
					        },
				        	{
				        		icon: 'circle',
				        		name: '好转',
				        	},
				        	{
				        		icon: 'circle',
				        		name: '未愈',
				        	},
				        	{
				        		icon: 'circle',
				        		name: '死亡',
				        	}
				        ]
				    },
				    series : [
				        {
				            type: 'pie',
				            radius : '55%',
				            center: ['50%', '50%'],
				            selectedMode: 'single',
				            label: {
				            	show: false,
				            	formatter: '{b}\n总额：{d} \n占比： {c}'
				            },
				            data:[
				                {
				                    value:200,
				                    name: '治愈',
				                    itemStyle: {
				                    	color: '#91AFEC'
				                    }
				                },
				                {
				                	value:620, 
				                	name: '好转',
				                    itemStyle: {
				                    	color: '#CFDF87'
				                    }
				                },
				                {
				                	value:290, 
				                	name: '未愈',
				                    itemStyle: {
				                    	color: '#63C2C6'
				                    }
				                },
				                {
				                	value:290, 
				                	name: '死亡',
				                    itemStyle: {
				                    	color: '#A2A2A2'
				                    }
				                }
				            ],
				            itemStyle: {
				                emphasis: {
				                    shadowBlur: 10,
				                    shadowOffsetX: 0,
				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
				                }
				            }
				        }
				    ]
				}
		}
	},
	methods: {
			number(data) {
	  			if(data != null) {
	  				return data.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
	  			} else {
	  				return
	  			}
	  		},
	  		// firstClick () {
	  		// 	if(this.title === '出入院动态') {
		  	// 		this.look_for('出院人数')
		  	// 		this.getBusHosDepAnalyse('outTotalPeo')
		  	// 	} else {
		  	// 		this.look_for('诊疗人次')
		  	// 		this.getbusEmeDepAnalyse ('medicalPeo')
		  		
		  	// 	}
	  		// },
			getDepartment () {
	          	var qs = require('qs');
	          	var self = this
	          	axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'getDepartment',
	              		platform: 'web',
	              		monthTime: self.month
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if (rep.data.statusCode === '10001') {
	              	// console.log(rep.data.data.department)
	           		self.departmentArr = rep.data.data.department
	           		if(!sessionStorage.getItem('depName')) {
	               		sessionStorage.setItem('depName',rep.data.data.department[0].name)
	               		self.value = rep.data.data.department[0].name
	                } else {
	               		self.value = sessionStorage.getItem('depName')
	                }
	                self.departmentArr.forEach((item) => {
						if (item.name === self.value) {
							self.depId = item.id
						}
					})
					if(self.outShow == true) {
						self.getbusDepAnalyse('outTotalPeo')
					}
	           		if(self.averageShow == true) {
	           			self.getbusDepAnalyse('medicalPeo')
	           		}
	           		if(self.useShow == true) {
	           			self.getbusDepAnalyse('surgeryNum')
	           		}
	           		if(self.otherShow == true) {
	           			if(self.doctor == true) {
	           				self.getbusDepAnalyse('medSumHuman')
	           			} else {
	           				self.getbusDepAnalyse('medSum')
	           			}
	           		}
	           		self.departmentArr.forEach((item) => {
	           			if(item.type === '临床服务') {
	           				item.dtDisabled = false
	           			} else {
	           				item.dtDisabled = true
	           			}
	           		})
	          		}
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
	 		},
			
			barClick (type) {
				var self = this
				switch(type) {
					case 'outTotalPeo': 
						self.outShow = true
						self.averageShow = false
						self.useShow = false
						self.otherShow = false
						break
					case 'medicalPeo':
						self.outShow = false
						self.averageShow = true
						self.useShow = false
						self.otherShow = false
						break
					case 'surgeryNum':
						self.outShow = false
						self.averageShow = false
						self.useShow = true
						self.otherShow = false
						break
					case 'medSum':
						self.outShow = false
						self.averageShow = false
						self.useShow = false
						self.otherShow = true
						break
				}
				this.getbusDepAnalyse(type)
			},

			getbusDepAnalyse (type) {
				var qs = require('qs');
	          	var self = this
	          	axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
		              		command: 'busDepAnalyse',
		              		platform: 'web',
		              		monthTime: self.month,
		              		depId: self.depId,
		              		type: type
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if (rep.data.statusCode === '10001') {

	              		let busHosMonthDep = rep.data.data.busHosMonthDep
	              		self.outTotalPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.outTotalPeo)
	              		self.medicalPeo = self.number(busHosMonthDep.thisMonth.medicalPeo)
	              		self.surgeryNum = self.number(busHosMonthDep.thisMonth.busSurMonthDep.surgeryNum)
	              		self.medIncomeTotal = self.number((Number(busHosMonthDep.thisMonth.busMedMonthDep.medIncomeTotal)/10000).toFixed(2))

	              		//药品趋势图
	              		self.optionsIncomeTrend.xAxis[0].data = busHosMonthDep.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busHosMonthDep.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busHosMonthDep.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
						self.myChart.setOption(self.optionsIncomeTrend)
	              		
	              		//经治组或医生
	              		if (type === 'medicalPeo' || type === 'medSumHuman') {
	              			self.options.yAxis[0].data = busHosMonthDep.thisMonth.personalTrend.xData
	              			self.departmentCode = busHosMonthDep.thisMonth.personalTrend.userIds
	              		} else{
	              			self.options.yAxis[0].data = busHosMonthDep.thisMonth.groupTrend.xData
	              			self.departmentCode = busHosMonthDep.thisMonth.groupTrend.codes
	              		}
	              		
						if(type === 'surgeryNum') {
							self.options.tooltip.trigger = 'axis'
							self.options.series = [
						        {
						            name: '甲级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#91AFEC'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#91AFEC'
						            	}
						            }
						        },
						        {
						            name: '乙级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#63C2C6'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#63C2C6'
						            	}
						            }
						        },
						        {
						            name: '丙级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#B0A8DE'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#B0A8DE'
						            	}
						            }
						        },
						        {
						            name: '丁级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#72B8EF'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#72B8EF'
						            	}
						            }
						        },
						        {
						            name: '戊级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#F3BA8B'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#F3BA8B'
						            	}
						            }
						        },
						        {
						            name: '己级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#CFDF87'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#CFDF87'
						            	}
						            }
						        },
						        {
						            name: '庚级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#92CF9F'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#92CF9F'
						            	}
						            }
						        },
						        {
						            name: '特级',
						            stack: '指标',
						            type: 'bar',
						            barWidth: 20,
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: false,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: '#E8D352'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: '#E8D352'
						            	}
						            }
						        },
						        {
						            name: '本月',
						            stack: '本月',
						            barWidth: 20,
						            barGap: '-100%',
						            type: 'bar',
						            data: [],
						            // legendHoverLink: false,
						            label: {
						            	show: true,
						            	position: 'right',
						            	color: '#333',
						            	formatter: function(params) {
						            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
						            	}
						            },
						            emphasis: {
						            	itemStyle: {
						            		color: 'rgba(128, 128, 128, 0)'
						            	}
						            },
						            itemStyle: {
						            	normal: {
						            		color: 'rgba(128, 128, 128, 0)'
						            	}
						            }
						        },
						        {	
						        	xAxisIndex: 1,
									yAxisIndex: 1,
						            type: 'bar',
						            barWidth: 20,
						            data: self.clickArr,
						            itemStyle: {
										normal: {
										barBorderColor: 'transparent',
										color: 'transparent'
										}
			            			}		
						            
						        }

							]
							self.options.series[0].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumA
							self.options.series[1].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumB
							self.options.series[2].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumC
							self.options.series[3].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumD
							self.options.series[4].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumE
							self.options.series[5].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumF
							self.options.series[6].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumG
							self.options.series[7].data = busHosMonthDep.thisMonth.groupTrend.ySurgeryNumS
							busHosMonthDep.thisMonth.groupTrend.ySurgeryNumS.forEach((item,index) => {
								let sum = parseFloat(self.options.series[0].data[index]) + parseFloat(self.options.series[1].data[index]) + parseFloat(self.options.series[2].data[index]) + parseFloat(self.options.series[3].data[index]) + parseFloat(self.options.series[4].data[index]) + parseFloat(self.options.series[5].data[index]) + parseFloat(self.options.series[6].data[index]) + parseFloat(self.options.series[7].data[index])
      							self.options.series[8].data[index] = sum
							})
						} else {
							self.clickArr = []
							for (var i = 0 ; i < self.options.yAxis[0].data.length; i++) {
								self.clickArr.push(100)
							}
							self.options.series = [{
							            name: '本月',
							            type: 'bar',
							            barWidth: 20,
							            data: [],
							            xAxisIndex: 0,
										yAxisIndex: 0,
							            // legendHoverLink: false,
							            label: {
							            	show: true,
							            	position: 'right',
							            	color: '#333',
							            	formatter: function(params) {
							            		return params.value.toString().replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,'$&,')
							            	}
							            },
							            emphasis: {
							            	itemStyle: {
							            		color: '#71C957'
							            	}
							            },
							            itemStyle: {
							            	normal: {
							            		color: '#A7DB98'
							            	}
							            }
							        },
							        {	
							        	xAxisIndex: 1,
										yAxisIndex: 1,
							            type: 'bar',
							            barWidth: 20,
							            data: self.clickArr,
							            itemStyle: {
											normal: {
											barBorderColor: 'transparent',
											color: 'transparent'
											}
				            			}		
							            
							        }
						    ]
						    if (type === 'medicalPeo' || type === 'medSumHuman') {
		              			self.options.series[0].data = busHosMonthDep.thisMonth.personalTrend.yData
		              		} else {
		              			self.options.series[0].data = busHosMonthDep.thisMonth.groupTrend.yData
		              		}
							
						}

						self.listHeight = (parseInt(self.options.yAxis[0].data.length)*45 + 60)
						// alert(parseInt(document.getElementById('options').offsetHeight))
						if(self.listHeight < 450) {
							self.listHeight = 450
						}
						self.listHeight = self.listHeight + 'px'
              			self.myChart5 = echarts.init(self.$refs.list)
              			setTimeout(() => self.myChart5.resize(), 0)
              			self.myChart5.clear()
						self.myChart5.setOption(self.options)
	              		if(self.options.yAxis[0].data.length == 0) {
	              			self.imgShow = true
	              		} else {
	              			self.imgShow = false
	              		}
	              		self.conTotal = self.number(busHosMonthDep.thisMonth.conTotal)
						self.optionsHaocai.series[0].data[0].value = busHosMonthDep.thisMonth.conDocNum
						self.optionsHaocai.series[0].data[1].value = busHosMonthDep.thisMonth.conNurNum
						// self.optionsHaocai.series[0].data[2].value = busHosMonthDep.thisMonth.conOtherNum
						switch(type) {
							case 'outTotalPeo': //住院耗材
								//出入院动态
			              		self.endMonPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.endMonPeo)//上期末人数
			              		self.endLeftPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.endLeftPeo) //期末留院人数
			              		self.inPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.inPeo)
			              		self.outPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.outPeo)
			              		self.intoPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.intoPeo)
			              		self.outSickPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.outSickPeo)
			              		self.outInBaby = self.number(busHosMonthDep.thisMonth.busHosMonthDep.outInBaby)
			              		self.tranOutPeo = self.number(busHosMonthDep.thisMonth.busHosMonthDep.tranOutPeo)
			              		//出入院动态饼图
			              		
			              		if (self.value == '妇产科') {
			              			var fuchankedongtai = {
									    tooltip : {
									        trigger: 'item',
									        formatter: "{b} : {c}<br> 占比：{d}% "
									    },
									    legend: {
									        orient: 'vertical',
									        bottom: 20,
									        itemWidth: 12,
									        itemHeight: 12,
									        // left: 'right',
									        right: 10,
									        bottom: 10,
									        align: 'right',
									        data: [
									        	{
										        	icon: 'circle',
										        	name: '新生儿',
										        },
										        {
										        	icon: 'circle',
										        	name: '治愈',
										        },
									        	{
									        		icon: 'circle',
									        		name: '好转',
									        	},
									        	{
									        		icon: 'circle',
									        		name: '未愈',
									        	},
									        	{
									        		icon: 'circle',
									        		name: '死亡',
									        	}
									        ]
									    },
									    series : [
									        {
									            type: 'pie',
									            radius : '55%',
									            center: ['50%', '50%'],
									            selectedMode: 'single',
									            label: {
									            	show: false,
									            	formatter: '{b}\n总额：{d} \n占比： {c}'
									            },
									            data:[
									                {
									                	value:290, 
									                	name: '新生儿',
									                    itemStyle: {
									                    	color: '#F5A623'
									                    }
									                },
									                {
									                    value:200,
									                    name: '治愈',
									                    itemStyle: {
									                    	color: '#91AFEC'
									                    }
									                },
									                {
									                	value:620, 
									                	name: '好转',
									                    itemStyle: {
									                    	color: '#CFDF87'
									                    }
									                },
									                {
									                	value:290, 
									                	name: '未愈',
									                    itemStyle: {
									                    	color: '#63C2C6'
									                    }
									                },
									                {
									                	value:290, 
									                	name: '死亡',
									                    itemStyle: {
									                    	color: '#A2A2A2'
									                    }
									                }
									            ],
									            itemStyle: {
									                emphasis: {
									                    shadowBlur: 10,
									                    shadowOffsetX: 0,
									                    shadowColor: 'rgba(0, 0, 0, 0.5)'
									                }
									            }
									        }
									    ]
									}

									fuchankedongtai.series[0].data[0].value = busHosMonthDep.thisMonth.busHosMonthDep.outInBaby
									fuchankedongtai.series[0].data[1].value = busHosMonthDep.thisMonth.busHosMonthDep.outInCure
				              		fuchankedongtai.series[0].data[2].value = busHosMonthDep.thisMonth.busHosMonthDep.outInBegood
				              		fuchankedongtai.series[0].data[3].value = busHosMonthDep.thisMonth.busHosMonthDep.outInNocure
				              		fuchankedongtai.series[0].data[4].value = busHosMonthDep.thisMonth.busHosMonthDep.outInDie
				              		self.myChart4 = echarts.init(self.$refs.dongtai)
									setTimeout(() => self.myChart4.resize(), 0)
									self.myChart4.clear()
									self.myChart4.setOption(fuchankedongtai)
			              		} else {
			              			self.optionsDongtai.series[0].data[0].value = busHosMonthDep.thisMonth.busHosMonthDep.outInCure
				              		self.optionsDongtai.series[0].data[1].value = busHosMonthDep.thisMonth.busHosMonthDep.outInBegood
				              		self.optionsDongtai.series[0].data[2].value = busHosMonthDep.thisMonth.busHosMonthDep.outInNocure
				              		self.optionsDongtai.series[0].data[3].value = busHosMonthDep.thisMonth.busHosMonthDep.outInDie
				              		self.myChart4 = echarts.init(self.$refs.dongtai)
									setTimeout(() => self.myChart4.resize(), 0)
									self.myChart4.clear()
									self.myChart4.setOption(self.optionsDongtai)
			              		}
			              		
								self.myChart3 = echarts.init(self.$refs.zhuyuanhaocai)
								break
							case 'medicalPeo':  //门诊耗材
								// alert(type)
								self.outpatientPeo = busHosMonthDep.thisMonth.outpatientPeo
								self.emergencyPeo = busHosMonthDep.thisMonth.emergencyPeo
								self.myChart3 = echarts.init(self.$refs.menzhenhaocai)
								break
							case 'surgeryNum': //手术耗材
								//手术
								self.optionsShoshu.series[0].data[0].value = busHosMonthDep.thisMonth.busSurMonthDep.surANum
								self.optionsShoshu.series[0].data[1].value = busHosMonthDep.thisMonth.busSurMonthDep.surBNum
								self.optionsShoshu.series[0].data[2].value = busHosMonthDep.thisMonth.busSurMonthDep.surCNum
								self.optionsShoshu.series[0].data[3].value = busHosMonthDep.thisMonth.busSurMonthDep.surDNum
								self.optionsShoshu.series[0].data[4].value = busHosMonthDep.thisMonth.busSurMonthDep.surENum
								self.optionsShoshu.series[0].data[5].value = busHosMonthDep.thisMonth.busSurMonthDep.surFNum
								self.optionsShoshu.series[0].data[6].value = busHosMonthDep.thisMonth.busSurMonthDep.surGNum
								self.optionsShoshu.series[0].data[7].value = busHosMonthDep.thisMonth.busSurMonthDep.surSNum
								self.myChart10 = echarts.init(self.$refs.shoushu)
								setTimeout(() => self.myChart10.resize(), 0)
								self.myChart10.clear()
								self.myChart10.setOption(self.optionsShoshu)
								self.myChart3 = echarts.init(self.$refs.shoushuhaocai)
								break
							case 'medSum':   //药品耗材
								self.myChart3 = echarts.init(self.$refs.yaopinhaocai)

								//住院药品
								self.optionsZhuyuan.series[0].data[0].value = busHosMonthDep.thisMonth.busMedMonthDep.medWestHos
								self.optionsZhuyuan.series[0].data[1].value = busHosMonthDep.thisMonth.busMedMonthDep.medMidHos
								self.optionsZhuyuan.series[0].data[2].value = busHosMonthDep.thisMonth.busMedMonthDep.medDrinkHos
								self.myChart20 = echarts.init(self.$refs.zhuyuanyaopin)
								setTimeout(() => self.myChart20.resize(), 0)
								self.myChart20.clear()
								self.myChart20.setOption(self.optionsZhuyuan)
								//门诊药品
								self.optionsMenzhen.series[0].data[0].value = busHosMonthDep.thisMonth.busMedMonthDep.medWestMem
								self.optionsMenzhen.series[0].data[1].value = busHosMonthDep.thisMonth.busMedMonthDep.medMidMem
								self.optionsMenzhen.series[0].data[2].value = busHosMonthDep.thisMonth.busMedMonthDep.medDrinkMem
								self.myChart21 = echarts.init(self.$refs.menzhenyaopin)
								setTimeout(() => self.myChart21.resize(), 0)
								self.myChart21.clear()
								self.myChart21.setOption(self.optionsMenzhen)
								self.medHosNum = self.number(busHosMonthDep.thisMonth.busMedMonthDep.medHosNum)
								self.medMemNum = self.number(busHosMonthDep.thisMonth.busMedMonthDep.medMemNum)
								self.conTotal = self.number(busHosMonthDep.thisMonth.conTotal)
								break
						}
						setTimeout(() => self.myChart3.resize(), 0)
						self.myChart3.clear()
						self.myChart3.setOption(self.optionsHaocai)
						
	          		}
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			},
			titleClick(type) {
				if(type == 'medSumHuman') {
					this.doctor = true
					this.treatmentGroup = false
					this.getbusDepAnalyse('medSumHuman')
				} else {
					this.treatmentGroup = true
					this.doctor = false
					this.getbusDepAnalyse('medSum')
				}
			},
			backClick () {
				let depName = sessionStorage.getItem('depName')
				var type = ''
				let depId = ''
				this.departmentArr.forEach((item) => {
					if (item.name === depName) {
						type = item.type
						depId = item.id
					}
				})
				if (type === '临床服务') {
						this.$router.push('/section-service/' + depId)

				} else if (type === '医技医辅') {
					this.$router.push('/section-hospital/' + depId)
					 
				}else {
					this.$router.push('/section-analysis/' + depId)
				}
			},			
			look_for (type) {
				this.type = type
				switch (this.type) {
				case '出院人数': 
					this.isActive1 = true
					this.isActive2 = false
					this.isActive3 = false
					break;
				case '诊疗人次': 
					this.isActive1 = true
					this.isActive2 = false
					this.isActive3 = false
					break;
					
				case '手术总量': 
					this.isActive1 = false
					this.isActive2 = true
					this.isActive3 = false
					break;
				case '用药总额': 
					this.isActive1 = false
					this.isActive2 = false
					this.isActive3 = true
					break;
			} 
			},
			change (name) {
				var type = ''
				var id = ''
				this.departmentArr.forEach((item) => {
					if (item.name === name) {
						type = item.type
						id = item.id
					}
				})
				this.depId = id
				this.value = name
				sessionStorage.setItem('depName',name)
				
				if(this.outShow == true) {
					this.barClick('outTotalPeo')
				}
				if(this.averageShow == true) {
					this.barClick('medicalPeo')
				}
				if(this.useShow == true) {
					this.barClick('surgeryNum')
				}
				if(this.otherShow == true) {
					this.barClick('medSum')
				}
				// this.outShow = true
				// this.averageShow = false
				// this.useShow = false
				// this.otherShow = false
			},
	},
	computed:{
		bgColor () {
			// const bgColor = ['active', 'active1', 'active2', 'active3', 'active4']
			// var bg;
			let bg = {}
			var bgColor = ''

			this.type === '门急诊情况'? bgColor = 'active' : this.type === '住院情况'? bgColor = 'active1' : this.type === '手术情况' ? bgColor = 'active2' : this.type === '药品使用情况' ? bgColor = 'active3' : this.type === '扣罚情况' ? bgColor = 'active4' : bgColor = 'active5'

			bg[bgColor] = true
			return bg
		}
	},
	mounted () {
		var self = this
		//bar的点击事件
		var myChart = echarts.init(self.$refs.list)
		
		myChart.on("click", function(params) {
			var depCode = self.departmentCode[params.dataIndex]
			// let clickIndex = null
			// if (clickIndex !== params.dataIndex) {
	  //           myChart.dispatchAction({
	  //             	type: 'downplay',
	  //             	// seriesIndex: 1,
	  //             	dataIndex: clickIndex,
	  //           })
	  //       }
	  //     	myChart.dispatchAction({
	  //       	type: 'highlight',
	  //       	// seriesIndex: params.seriesIndex,
	  //       	dataIndex: params.dataIndex
	  //     	})
	  //     	clickIndex = params.dataIndex
	  var index = params.dataIndex;
	  	if( self.useShow == true ) {
	  		for(var i = 0 ; i < self.options.yAxis[0].data.length ; i++){
		           	if(self.options.series[0].data[i].value){
		                self.options.series[0].data[i] = self.options.series[0].data[i].value;
		            }
		            if(self.options.series[1].data[i].value){
		                self.options.series[1].data[i] = self.options.series[1].data[i].value;
		            }
		            if(self.options.series[2].data[i].value){
		                self.options.series[2].data[i] = self.options.series[2].data[i].value;
		            }
		            if(self.options.series[3].data[i].value){
		                self.options.series[3].data[i] = self.options.series[3].data[i].value;
		            }
		            if(self.options.series[4].data[i].value){
		                self.options.series[4].data[i] = self.options.series[4].data[i].value;
		            }
		            if(self.options.series[5].data[i].value){
		                self.options.series[5].data[i] = self.options.series[5].data[i].value;
		            }
		            if(self.options.series[6].data[i].value){
		                self.options.series[6].data[i] = self.options.series[6].data[i].value;
		            }
		            if(self.options.series[7].data[i].value){
		                self.options.series[7].data[i] = self.options.series[7].data[i].value;
		            }
		        if(index == i){
		            self.options.series[0].data[i] = {
		                value : self.options.series[0].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#698ED9'
		                    }
		                }
		            }
		            self.options.series[1].data[i] = {
		                value : self.options.series[1].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#45B7BC'
		                    }
		                }
		            }
		            self.options.series[2].data[i] = {
		                value : self.options.series[2].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#9487DB'
		                    }
		                }
		            }
		            self.options.series[3].data[i] = {
		                value : self.options.series[3].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#5FAEEC'
		                    }
		                }
		            }
		            self.options.series[4].data[i] = {
		                value : self.options.series[4].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#EBAB76'
		                    }
		                }
		            }
		            self.options.series[5].data[i] = {
		                value : self.options.series[5].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#C3DB52'
		                    }
		                }
		            }
		            self.options.series[6].data[i] = {
		                value : self.options.series[6].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#7ACF8C'
		                    }
		                }
		            }
		            self.options.series[7].data[i] = {
		                value : self.options.series[7].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#E3CA2B'
		                    }
		                }
		            }
		        }
		    }
	  	} else {
	  		for(var i = 0 ; i < self.options.yAxis[0].data.length ; i++){
		           	if(self.options.series[0].data[i].value){
		                self.options.series[0].data[i] = self.options.series[0].data[i].value;
		            }
		        if(index == i){
		            self.options.series[0].data[i] = {
		                value : self.options.series[0].data[i],
		                itemStyle:{
		                    normal:{
		                        color : '#71C957'
		                    }
		                }
		            }
		        }
		    }
	  	}
	  		
		    myChart.setOption(self.options)
			if( self.outShow == true ) {
				var qs = require('qs')
				axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'busMonthGroupSurNum',
	              		platform: 'web',
	              		monthTime: self.month,
	              		type: 'hospital',
	              		code: depCode
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if(rep.data.statusCode === '10001') {
	              		let busMonthGroup = rep.data.data.busMonthGroup
	              		self.optionsIncomeTrend.xAxis[0].data = busMonthGroup.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busMonthGroup.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busMonthGroup.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
		           		self.myChart.clear()
						self.myChart.setOption(self.optionsIncomeTrend)
	              	}
	          		
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			}
			if( self.averageShow == true ) {
				var qs = require('qs')
				axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'busMonthPersonalTrend',
	              		platform: 'web',
	              		monthTime: self.month,
	              		id: depCode,
	              		type: 'medicalPeo'
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if(rep.data.statusCode === '10001') {
	              		let busMonthGroup = rep.data.data.busMonthPersonal
	              		self.optionsIncomeTrend.xAxis[0].data = busMonthGroup.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busMonthGroup.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busMonthGroup.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
		           		self.myChart.clear()
						self.myChart.setOption(self.optionsIncomeTrend)
	              	
	              	}
	          		
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			}
			if( self.useShow == true ) {
				var qs = require('qs')
				axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'busMonthGroupSurNum',
	              		platform: 'web',
	              		monthTime: self.month,
	              		code: depCode,
	              		type: 'surNum'
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if(rep.data.statusCode === '10001') {
	              		let busMonthGroup = rep.data.data.busMonthGroup
	              		//趋势图
	              		self.optionsIncomeTrend.xAxis[0].data = busMonthGroup.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busMonthGroup.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busMonthGroup.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
		           		self.myChart.clear()
						self.myChart.setOption(self.optionsIncomeTrend)
						//饼图
	              		self.optionsShoshu.series[0].data[1].value = busMonthGroup.thisMonth.info.surANum
						self.optionsShoshu.series[0].data[2].value = busMonthGroup.thisMonth.info.surBNum
						self.optionsShoshu.series[0].data[3].value = busMonthGroup.thisMonth.info.surCNum
						self.optionsShoshu.series[0].data[4].value = busMonthGroup.thisMonth.info.surDNum
						self.optionsShoshu.series[0].data[5].value = busMonthGroup.thisMonth.info.surENum
						self.optionsShoshu.series[0].data[6].value = busMonthGroup.thisMonth.info.surFNum
						self.optionsShoshu.series[0].data[7].value = busMonthGroup.thisMonth.info.surGNum
						self.optionsShoshu.series[0].data[0].value = busMonthGroup.thisMonth.info.surSNum
						self.myChart10 = echarts.init(self.$refs.shoushu)
						setTimeout(() => self.myChart10.resize(), 0)
						self.myChart10.clear()
						self.myChart10.setOption(self.optionsShoshu)
	              	}
	          		
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			}
			if( self.otherShow == true ) {
				var qs = require('qs')
				axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'busMonthGroupSurNum',
	              		platform: 'web',
	              		monthTime: self.month,
	              		code: depCode,
	              		type: 'medSum'
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if(rep.data.statusCode === '10001') {
	              		let busMonthGroup = rep.data.data.busMonthGroup
	              		//趋势图
	              		self.optionsIncomeTrend.xAxis[0].data = busMonthGroup.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busMonthGroup.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busMonthGroup.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
		           		self.myChart.clear()
						self.myChart.setOption(self.optionsIncomeTrend)
						
	              	}
	          		
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			}
			if( self.doctor == true ) {
				var qs = require('qs')
				axios.post('/service', 
	          		qs.stringify({"data": JSON.stringify({
	              		command: 'busMonthPersonalTrend',
	              		platform: 'web',
	              		monthTime: self.month,
	              		id: depCode,
	              		type: 'medSum'
	             		})
	          		}), {
	              		headers: {
	               			"BBG-Key": "ab9ef204-3253-49d4-b229-3cc2383480a6",
	              		}
	            }).then(function (rep) {
	              	if(rep.data.statusCode === '10001') {
	              		let busMonthGroup = rep.data.data.busMonthPersonal
	              		self.optionsIncomeTrend.xAxis[0].data = busMonthGroup.thisMonth.monthTrend.xData
		           		self.optionsIncomeTrend.series[0].data = busMonthGroup.thisMonth.monthTrend.yData
		           		self.optionsIncomeTrend.series[1].data = busMonthGroup.samePeriod.monthTrend.yData
		           		self.myChart = echarts.init(self.$refs.incomeTrend)
		           		self.myChart.clear()
						self.myChart.setOption(self.optionsIncomeTrend)
	              	
	              	}
	          		
	         	}).catch(function (error) {
	          		// console.log(error);
	         	});
			}
		})
	},
	created () {
		this.getDepartment()
		console.log(this.options)
		this.heightClient = document.body.clientHeight - 170 + 'px'
		this.a = false
		this.a = true
	},
	props: ['month'],
	watch: {
		month (newV, oldV) {
			this.month = newV
			// this.getbusDepAnalyse('outTotalPeo')
			this.getDepartment()
			this.heightClient = document.body.clientHeight - 170 + 'px'
			this.a = false
			this.a = true
		}
	}
}
</script>
<style lang="scss" scoped>
	header{
		height: 63px;
		background: #fff;
		line-height: 63px;
		padding-left: 130px;
		font-size: 16px;
		.div{
			margin: 0 auto;
			float: right;
			margin-right: 45%;
		}
		span:nth-child(1){
			color: #989898;
			margin-right: 40px;
			cursor: pointer;
		}
		span:nth-child(1):hover{
			color: #85C8FD;
		}
		span:nth-child(2){
			font-size: 16px;
			color: #646464;
		}
	}
	.detail_container{
		// min-height: 850px;
		background: #f8f8f8;
		padding: 1.4%;
		.list-title {
			width: 50%;
			display: inline-block;
			text-align: center; 
			height: 30px; 
			line-height: 30px;
			font-family: '微软雅黑,PingFangSC';
			font-size: 14px;
			color: #646464; 
			margin: 10px 25%;
			span {
				display: inline-block;
				width: 80px;
				height: 26px;
				color: #6DBA56;
				background: #FFFFFF;
				border: 1px solid #94D181;
				cursor: pointer;
				box-shadow: 0 2px 4px 0 #C2ECB5;
				border-radius: 0 3px 3px 0;
				margin-right: -6px;
				&:first-child {
					border-radius: 3px 0 0 3px;
				}
				&:hover {
					background: #6DBA56;
					box-shadow: 0 2px 4px 0 #94D181;
					color: #fff;
				} 
			}
			.activeSpan {
				background: #6DBA56;
				box-shadow: 0 2px 4px 0 #94D181;
				color: #fff;
			} 
		}
		.side_choose{
			width: 39%;
			background: #fff;
			margin-right: 1%;
			height: 98%;
			box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
			float: left;
			.side_title{
				line-height: 45px;
				font-size: 16px;
				color: #646464;
				text-indent: 20px;
				border-bottom: 1px solid #ccc;
			}
			.choose_bar{
				height: 155px;
				padding-left: 2%;
				padding-right: 2%;
				width: 96%;
				.active{
					background: #88C43F !important;
					box-shadow: 0 2px 12px 0 rgba(164,213,105,0.42);
					border-radius: 5px;
					color: #fff !important;
					span{
						color: #fff !important;
					}
				}
				.bar{
					width: 20%;
					height: 88px;
					padding: 10px 2%;
					line-height: 20px;
					margin-top: 24px;
					border-radius: 5px;
					background: #f1f1f1;
					float: left;
					margin-right: 1%;
					cursor: pointer;
					font-family: '微软雅黑,PingFangSC';
					font-size: 12px;
					color: #787878;
					.bar-title {
						height: 17px;
						line-height: 17px;
						margin-bottom: 9px;
						font-size: 13px;
						font-family: '微软雅黑,PingFangSC'
					}
					.bar-list{
						// float: left;
						width: 100%;
						margin-right: 7%;
						margin-left: 3%;
						font-size: 16px;
						height: 22px;
						line-height: 22px;
						color: #4D4D4D;
						span {
							font-family: '微软雅黑,PingFangSC';
							color: '#787878'
						};
						span:nth-child(1){
							line-height: 28px;
						}
						
					}
					.spe{
						span:nth-child(1){
							font-size: 18px;
							color: #4D4D4D;
							line-height: 28px;
						}	
					}
				}
				.bar:last-child{
					margin-right: 0;
				}
				.bar:hover{
					background-color: #88C43F  !important;
					color:#fff !important;
					border-radius: 5px;
					.bar-list{
						span:nth-child(1){
							color:#fff;
						}
					}
				}
			}
		}
		.container_right{
			float: left;
			width: 60%;
			height: 100%;
			.right_title{
				height: 43px;
				line-height: 43px;
				padding-left: 22px;
				font-size: 17px;
				font-weight: 600;
				color: #4D4D4D;
				border-bottom: 1px solid #ddd;
				.smtitle{
					font-size: 14px;
					color: #9B9B9B;
				}
			}
			.right_top{
				background: #fff;
				box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
			}
			.right_top, .right_bottom{
				height: 48%;
				margin-bottom: 2%;
			}
			.right_bottom {
				display: flex;
				.big_left {
					display: flex;
					width: 66%;
					height: 98%;
					background: #fff;
					margin-bottom: 2%;
					margin-right: 1%;
					box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
					.left {
						width: 50%;
						ul {
							width: 100%;
							height: calc(100% - 50px);
							vertical-align: middle;
							border-right: 10px solid #F7F7F7;
							margin-right: 2%;
							li {
								display: inline-block;
								width: 45%;
								height: 33%;
								text-align: center;
								span {
									position: relative;
									top: 25%;
									font-size: 24px;
									height: 24px;
									line-height: 24px;
									color: #4D4D4D;
									&:last-child {
										font-size: 14px;
										color: #6A6A6A;
									}
								}
							}
							span {
								// display: inline-block;
								position: relative;
								top: 5%;
								font-size: 25px;
								color: #6A6A6A;
							}
						}
					}
					.right {
						width: 50%;
					}
				}
				.small_right {
					float: left;
					width: 33%;
					height: 98%;
					background: #fff;
					margin-bottom: 2%;
					box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
					.span-sr {
						font-size: 14px;
						font-family: '微软雅黑,PingFangSC'; 
						color: #646464; 
						display: inline-block; 
						height: 24px; 
						line-height: 24px; 
						margin: 15px 30px;
					}
				}
				.normal {
					width: 66%;
					height: 98%;
					background: #fff;
					margin-bottom: 2%;
					margin-right: 1%;
					box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
					// &:first-child {
					// 	margin-right: 2%;
					// }
					ul {
						width: 100%;
						height: calc(100% - 50px);
						vertical-align: middle;
						// border-right: 10px solid #F7F7F7;
						margin-top: 8%;
						height: 30%;
						li {
							display: inline-block;
							width: 45%;
							height: 100%;
							text-align: center;
							span {
								position: relative;
								top: 25%;
								font-size: 24px;
								height: 24px;
								line-height: 24px;
								color: #4D4D4D;
								&:last-child {
									font-size: 14px;
									color: #6A6A6A;
								}
							}
						}
						span {
							// display: inline-block;
							position: relative;
							top: 5%;
							font-size: 25px;
							color: #6A6A6A;
						}
					}
					img {
						display: block;
						width: 80%;
						margin: 0 auto;
					}
				}
				.small_bar {
					width: 33%;
					height: 98%;
					background: #fff;
					margin-bottom: 2%;
					margin-left: 1%;
					box-shadow: 0 2px 8px 0 rgba(0,0,0,0.17);
					&:first-child {
						margin-left: 0;
					}
					.span-sr {
						font-size: 14px; 
						font-family: '微软雅黑,PingFangSC'; 
						color: #646464; 
						display: inline-block; 
						height: 24px; 
						line-height: 24px; 
						margin: 15px 30px;
					}
				}
			}
		}
	}
</style>